<!--
  管理员登录界面
-->
<template>
  <div>
    <h1>{{ msg }}</h1>
    <el-row>
      <el-col :span="8" :push="8">
        <el-form ref="form" :model="admin" label-width="80px" status-icon :rules="rules">
          <el-form-item label="用户名:" prop="name">
            <el-input v-model="admin.name" placeholder="请输入用户名" prefix-icon="el-icon-user-solid"></el-input>
          </el-form-item>
          <el-form-item label="密码:" prop="password">
            <el-input v-model="admin.password" show-password placeholder="请输入密码" prefix-icon="el-icon-lock"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button @click="login" type="primary" plain>登录</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>

<script>

import instance from "../utils/request";

export default {
  name: "Login_admin",
  data(){
    return {
      msg:'管理员登录',
      admin:{
        name:'',
        password:''
      },
      /*
        表单验证规则
       */
      rules:{
        name: [
          {required:true, message:'请输入用户名', trigger: 'blur'},
          {min:5, max:12}
        ],
        password:[
          {required:true, message:'请输入密码', trigger: 'blur'},
          {min:5, max:12}
        ]
      }
    }
  },
  methods:{
    login(){
      if(!this.admin.name || !this.admin.password){
        alert('请完善登录信息');
        return;
      }
      var _this = this;
      instance.defaults.withCredentials = true// Cookie跨域
      instance.post('/api/admin/login',{
        name: _this.admin.name,
        password: _this.admin.password
      }).then(function (res) {
        if(res.data.code === 200){
          alert('登录成功');
          /*
         登录成功操作：
             修改登录状态
             设置当前登录管理员id，密码
             跳转管理员主页
          */
          _this.$store.commit('changeAdmin_StatusToTrue');
          _this.$router.push({name:'Admin'});
          _this.$store.commit('setId',_this.admin.name);
          _this.$store.commit('changeLogin_Status');
        }
        else if(res.data.code === 202)
          alert('用户名或密码错误');
      }).catch(function (err) {
        console.log(err);
      })
    }
  }
}
</script>

<style scoped>

</style>
